<!-- 
    利用DOM可以操作如下表单元素的属性
    type,value,checked,selected,disabled
 -->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button>按钮</button>
    <input type="text" value="输入内容">

    <script>
        //1.获取元素
        var btn = document.querySelector('button');
        var input = document.querySelector('input');
        //2.注册事件,处理程序
        btn.onclick = function () {
            // input.innerHTML = '爱你中国';  //innerHTML是普盒子才会拥有。比如div标签里面的内容
            //表单里面的盒值 文字内容是通过 value 来修改的。
            input.value = '被点击了';  //当点击按钮时，表单中出现 ‘被点击了’
            //如果想要某个表单被禁用，不能在点击 disabled属性，按钮button禁用
            // btn.disabled = true;
            this.disabled = true;
            //this 指向的是事件函数的调用者 ，调用者是btn所以this指向btn就能这样表示

        }
    </script>

</body>

</html>